De nada adianta saber todos os comandos da linguagem
HTML, disponibilizar um conteúdo interessante para o internauta, ter
imagens bem feitas se não soubermos (e utilizarmos) regras básicas
de Design. O Design é que vai transformar um site "legalzinho" em
um importante veículo de comunicação.
Não temos a pretensão de formar um Web Designer aqui, mas apenas
dar alguns conceitos básicos que se forem seguidos deixarão
sua página com um aspecto mais profissional, com um acabamento mais
refinado e fará com que os seus visitantes queiram sempre dar um pulo
no seu site. Todos os meses estaremos aqui dando dicas de como fazer seu
site melhor...
Hoje em dia, com todos os programas existentes, é muito fácil
fazer um site que pode ser um campeão de visitação ou
apenas mais um site perdido no cyberespaço aguardando um internauta
perdido aparecer por lá...
Vários detalhes fazem a diferença entre sua página ser
apenas "mais uma página" ou "aquela" página que até
o pessoal da MICROSOFT ficaria de boca aberta ao visitá-la.
Sem sombra de dúvida um dos pontos mais importantes da sua página
é o Design.
Entende-se por Design:
1) a disposição de forma ordenada dos elementos gráficos
e do texto na página,
2) a formatação de ítens que criam uma identidade visual
(logotipos, vinhetas e seções) e
3) a identidade visual em sí, a uniformidade de todos estes elementos
no site.
Os sites desenvolvidos por profissionais de criação da Internet
(chamados de Webmasters, ou Mestres da Web) utilizam princípios
gráficos e visuais para especificar cuidadosamente a posição
e as relações dos elementos de cada página, mantendo
um controle rigoroso do layout.
Um site desenvolvido tendo um design em mente vai estimular e guiar os visitantes
em potencial, proporcionando-lhes uma experiência agradável
da primeira à última página.
Você mesmo já deve ter sentido o incômodo que é
navegar por sites que não mantém um design estruturado:
€ Encontrar as informações
que você procura é demorado demais,
€ Existe uma sensação de
estar "perdido" ao navegar,
€ Quando se passa de uma página
para outra não se mantém a mesma estrutura das anteriores,
€ Não existem elementos que o ajudem
a saber o que site possui.
Vamos ver alguns conceitos e dicas que, se forem seguidos, podem transformar
seu site em um lugar que desperta o desejo de ser visitado.
A primeira e mais importante regra a ser seguida para seu site se diferenciar
dos demais é definir um design e segui-lo.
Infelizmente muitos sites não atingem seu objetivo pois se afastam
do que foi planejado inicialmente ou mudando o design ao longo das
páginas.
Você agora deve estar perguntando:
Qual deve ser o estilo das minhas páginas?
Como organizar a informação em cada página?
Que formato deve ter meu site ?
Para responder estas (e outras) perguntas tenha sempre em mente:
nunca
misture designs diferentes num mesmo site.
Com certeza você já sentiu a desagradável
sensação de visitar sites que misturam longas páginas
de texto corrido com frames e layouts que mudam após um único
clique do mouse e o levam a pensar que você esta passando por vários
sites diferentes...
Assim que definir o design geral das suas páginas, utilize-o sempre
em todas as páginas do seu site. Isto dará ao visitante a
sensação de saber sempre onde está e de poder encontrar
o que procura. De nada adianta ter a informação mais importante
do mundo se o internauta não puder encontrá-la em seu site.
Certamente ele vai buscar em outro lugar o que não acha em seu
site...
Existem vários estilos de design que podem ser usados com sucesso
em seu site. Você vai perceber que nem sempre o design de um site
dará certo em outro. Assim, antes de sair copiando o que você
encontrar por ai pense e analise o que vai querer usar nas suas
páginas.
Basicamente existem quatro formas (ou padrões) que você deve
escolher para desenvolver seu site:
É o layout obtido utilizando apenas comandos HTML
Embora este tipo de design possa resultar numa boa solução
em determinadas situações (como por exemplo, páginas
que serão impressas pelo usuário) ela tem um grande número
de desvantagens na maior parte dos casos, pois normalmente resulta em
páginas intermináveis e pouco estruturadas, dificultando a
sua manutenção e prejudicando o usuário, na medida em
que lhe torna mais difícil encontrar a informação que
procura. Imagine como é divertido ler uma página que usa a
fonte Arial, corpo 6, que você desce, desce e não tem
fim...
O principal problema de usar apenas HTML é que não existe a
possibilidade de controlar (de forma precisa) o posicionamento de objetos
na página.
Criam um design de forma simples e compatível com todos os
browsers
A forma mais simples para controlar o posicionamento dos elementos em uma
página é usando o comando TABLE (tabelas). A possibilidade
de usar linhas e colunas (formando uma matriz) permite um controle razoável
sobre as páginas (mantendo um design elegante e ordenado) e ao mesmo
tempo simples, sem a necessidade de conhecer comando mais
avançados.
Podemos dizer que o comando TABLE é a primeira etapa para as pessoas
que estão se aprofundando em HTML e tentando criar páginas
mais profissionais.
A principal vantagem de usar esta opção é que as tabelas
são compatíveis com todos os navegadores (ao contrário
de frames e de Style Sheets que nem sempre funcionam da mesma forma no Internet
Explorer e no Netscape).
Menus de navegação de forma profissional
Os frames proporcionam uma forma excelente de organizar e estruturar o
conteúdo de seus documentos.
Este comando permite DIVIDIR a tela em partes (janelas) que podem ser
estáticas (contendo menus para a navegação) ou
dinâmicas (com as informações que o usuário procura).
O uso de frames deixa a página muito mais profissional pois permite
criar menus que auxiliam o usuário a navegar pelo site. Outra vantagem
é que os frames mantém uma uniformidade em todo o site, dando
uma sensação de segurança.
Um cuidado deve ser tomado com o uso de frames, especialmente porque a
utilização descuidada ou excessiva pode resultar num design
muito apelativo e confuso, dando a impressão de desordem ao
site.
A Microsoft dá uma mão para o HTML
As style sheets (folhas de estilo) foram a grande contribuição
do Microsoft Internet Explorer 3.0 para o HTML.
Basicamente, uma style sheet funciona como um "template" (modelo) que controla
a formatação das tags HTML de uma página, permitindo,
por exemplo, definir a fonte e/ou o alinhamento do texto de um parágrafo.
Do ponto de vista da criação de documentos HTML as style sheets
oferecem vantagens importantes como, a utilização de
formatações adicionais e a simplificação do trabalho
de manutenção e alteração das
páginas.
O único problema é a incompatibilidade entre os
browsers.
O segundo ponto que você deve ter em mente para a construção
de um site bem organizado é o comando link.
A boa ou má utilização deste comando vai permitir criar
sites bem estruturados (e agradáveis) ou de difícil
navegação (e confuso).
Este tag permite conduzir o usuário pelas páginas do seu site
fazendo-o navegar até encontrar o que precisa. Se as
informações estiverem dispostas de forma planejada (e ordenada)
este processo será agradável, pois se dará de uma maneira
fácil e intuitiva.
Entretanto, se o usuário sentir que esta pulando de uma página
para outra sem encontrar o que procura certamente não vai voltar ou
sairá do seu site antes mesmo de encontrar o que procura...
Você deve tomar muito cuidado ao planejar seu site para evitar que
ele seja uma sucessão de páginas que não contém
informação, apenas links. Veja alguns conselhos para uma melhor
utilização deste comando:
Use os links com cautela
Existe um ditado que diz: a diferença entre o remédio e o veneno
é a DOSE...
O comando link funcionam exatamente da mesma forma. Se você colocar
em falta não terá resultados satisfatórios. Se colocar
em excesso também não.
Assim, navegue pelo seu site pensando sempre como se você fosse o
usuário. Desta forma você poderá encontrar problemas
com o excesso ou a falta de links.
Use palavras ou frases importantes nos links
Os links servem para levar o usuário de uma página para outra
e devem ser diretos. Assim, use apenas uma ou duas palavras como link e uma
frase direta para indicar isso ao usuário. Procure não fazer
links desta forma:
Clique aqui para ver os próximos 10
itens
Prefira algo assim:
Clique aqui para ver os próximos
10 itens
Ou assim:
Clique para os próximos 10
itens
Ou ainda (se preferir simplicar bastante):
Próximos 10
Padronize seus links e agrade seus visitantes
Lembre-se de padronizar seus links por todas as páginas do seu site.
Isto faz com que seus visitantes se sintam mais confiantes e não
terão medo de conhecer mais sobre seu site. Para isto:
- Inclua links de navegação no fim de cada página (voltar,
avançar, home, etc)
- Use menus semelhantes em todas as páginas
- Se possível use Tables ou Frames para criar menus mais
sofisticados
Disponibilize um serviço de busca em seu site
Nada mais útil para o internauta que ter um serviço de busca
no site. Existem vários scripts de busca disponíveis (e muitos
deles são gratuítos) e vale a pena incluir um seu
site.
A utilização de um conjunto de imagens de qualidade pode beneficiar
muito o aspecto de seu site.
Lembre-se que uma imagem vale mais que mil palavras. Entretanto, quando mal
utilizada, uma imagem pode apenas servir para acabar com todo seu
design.
Lembre-se que o fator mais importante nas imagens é o seu tamanho.
Nenhum usuário vai ficar esperando para ver uma imagen de algumas
centenas de KB ser carregada... Procure seguir estas
orientações:
- Use apenas imagens que REALMENTE são importantes para o conteúdo
do site (nada de GIFs animados que são totalmente inúteis)
- Imponha um limite para o número de imagens pesadas (maiores que
15 Kb) em cada página
- Use todos os truques possíveis para reduzir o tamanho dos arquivos
.